<link rel="stylesheet" href="templates/authority/common/css/zTreeStyle.css"/>
<link rel="stylesheet" href="templates/authority/qxgl/css/qxgl.css"/>
<link rel="stylesheet" href="templates/authority/sendedMessage/css/sendedMsg.css" />
<div id="messagesendstatistic">
    <div class="pd14 vany_authority">
        <div class="vany_treeTable pd14">
            <div id="crumbs" class="pb10">
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: '/' }">消息管理</el-breadcrumb-item>
                    <el-breadcrumb-item onclick="jumpToSended()">已发消息</el-breadcrumb-item>
                    <el-breadcrumb-item onclick="jumpToDetail()">消息详情</el-breadcrumb-item>
                    <el-breadcrumb-item onclick="jumpToStatistic()">消息统计</el-breadcrumb-item>
                    <el-breadcrumb-item>消息发送统计</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <div>
                <el-row :gutter="10">
                    <el-col :span="6">
                        <div class="statistic_div">
                            <p class="title">消息总人数</p>
                            <p class="num">{{stateCounts[2]}}</p>
                        </div>
                    </el-col>
                    <el-col :span="6">
                        <div class="statistic_div">
                            <p class="title">发送失败</p>
                            <p class="num">{{stateCounts[1]}}</p>
                        </div>
                    </el-col>
                    <el-col :span="6">
                        <div class="statistic_div">
                            <p class="title">发送成功</p>
                            <p class="num">{{stateCounts[0]}}</p>
                        </div>
                    </el-col>
                    <el-col :span="6">
                        <div class="statistic_div">
                            <p class="title">发送成功率</p>
                            <p class="num">{{ successRate }}</p>
                        </div>
                    </el-col>
                </el-row>
            </div>
            <div class="treeTable" style="margin-top:15px">
                <div class="item i2">
                    <div class="pd14">
                        <el-row :gutter="8">
                            <el-col :span="12">
                                <el-row :gutter="8">
                                    <el-col :span="12">
                                        <el-input placeholder="请输入您要搜索的内容" icon="search">
                                        </el-input>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-dropdown @command="filterStatus">
                                            <el-button>
                                                {{ curFilter }}<i class="el-icon-caret-bottom el-icon--right"></i>
                                            </el-button>
                                            <el-dropdown-menu slot="dropdown">
                                                <el-dropdown-item divided v-for="item in filtersStatusCount" :command="item.value">{{item.text}}</el-dropdown-item>
                                            </el-dropdown-menu>
                                        </el-dropdown>
                                    </el-col>
                                </el-row>
                            </el-col>
                        </el-row>
                    </div>
                    <el-table :data="tableData" style="width: 100%;" ref="multipleTable" @selection-change="handleSelectionChange">
                        <el-table-column type="selection" v-if="status === '9'"></el-table-column>
                        <el-table-column label="编号" type="index" width="200"></el-table-column>
                        <el-table-column prop="userAccount" label="账号"></el-table-column>
                        <el-table-column prop="userName" label="姓名"></el-table-column>
                        <el-table-column prop="dept" label="部门"></el-table-column>
                        <el-table-column prop="receiveTime" label="发送时间"></el-table-column>
                        <el-table-column label="发送状态" v-if="curFilterVal !== '1'">
                            <template scope="scope">
                                <span style="color: #c0c0c0;" v-if="scope.row.receiveStatus == 1">发送成功</span>
                                <span style="color: #20a0ff; cursor: pointer" v-if="scope.row.receiveStatus == 9">重新发送</span>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
            <div class="pd14" style="border-top: 0;background: #eaedf2;">
                <el-row type="flex" justify="end">
                    <el-col :span="12" v-if="status === '9'">
                        <el-button type="primary" @click="batchSend()">批量发送</el-button>
                        <el-button type="primary" @click="allSend()">全部发送</el-button>
                    </el-col>
                    <el-col :span="12">
                        <el-row type="flex" justify="end">
                            <el-pagination
                                    @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange"
                                    :current-page="pageIndex"
                                    :page-sizes="[10, 20, 30]"
                                    :page-size="pageSize"
                                    layout="total, sizes, prev, pager, next, jumper"
                                    :total="total">
                            </el-pagination>
                        </el-row>
                    </el-col>
                </el-row>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="templates/authority/sendedMessage/js/messagesendstatistic.js"></script>
<script type="text/javascript" src="templates/authority/sendedMessage/js/sendedMessagePublic.js"></script>

